<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <script>

        /**
         * class中getter和setter设置
         */
        class Phone {
            constructor(jiaqian) {
                this.jiaqian = jiaqian
            }
            get price() {
                return this.jiaqian + 10
            }

            set price(val) {
                this.jiaqian = val;
            }
        }


        var p = new Phone(1000);
        console.log(p.price);
        // p.price = 11;
        p.price = 2000;

        console.log(p.price, '价钱被改变过');

        /**
         * es5和es6的继承
         * 子类对父类方法的重写
         */
         //es6 继承
        //  class Phone {
        //      constructor(brand,price) {
        //         this.brand = brand;
        //         this.price = price;
        //      }

        //      call() {
        //          console.log('可以打电话');
        //      }
        //  }
         
        //  class SmartPhone extends Phone {
        //      constructor(brand, price, color,size) {
        //          super(brand, price) // == Phone.call(this, brand, price)
        //          this.color = color;
        //          this.size = size;
        //      }
             
        //      photo() {
        //          console.log('可以拍照');
        //      }
        //      playGame() {
        //          console.log('可以玩游戏');
        //      }

        //      call() {
        //          console.log('可以视频通话');
        //      }
        //  }

        //  let x = new SmartPhone('xiaomi', 1000, 'red', '5in');
         
        //  console.log(x);
        //  x.call() //基类里定义的一个方法

        //  x.photo()
        //  x.playGame();
        //  console.log(x.brand);




         //es5 继承
        //  function Person(username,age) {
        //     this.username = username;
        //     this.age = age
        //  }
        //  Person.prototype.say = function () {
        //      console.log('可以说话');
        //  }
         
        //  function Girl(username, age, sex) {
        //     Person.call(this,username, age);
        //     this.sex = sex;
        //  }

        //  Girl.prototype = new Person;

        //  Girl.prototype.tiaowu = function (){
        //      console.log('可以跳舞');
        //  }

        //  let xiaolan = new Girl('xiaolan', 30, '女');
         
        //  console.log(xiaolan, 'xiaolan');
        //  xiaolan.say();
        //  xiaolan.tiaowu();
         
        
        /**
         * es5和es6 的静态方法和静态属性
         * 能被类调用的就是静态属性和静态方法
         */

        // class Phone {
        //     constructor() {}
        //     static call () {
        //         console.log('是通过static定的的静态方法');
        //     }

        //     calloo () {
        //         console.log('普通的方法');
        //     }
        // }

        // let p = new Phone();
        // try {
        //     p.calloo()
        //     console.log('被实例调用');
        // } catch(e) {
        //     Phone.calloo();
        //     console.log('被类调用')
        // }
        
        
        // function Phone() {

        // }

        // Phone.prototype.calloo = function () {
        //     console.log('实例调用的');
        // }

        // Phone.brand  = 'xiaomi';
        // Phone.call = function () {
        //     console.log('是被类调用的');
        // }

        // var p = new Phone();
        // p.calloo();

        // console.log(p.call())
        // p.call()
        // console.log(Phone.brand);
        // Phone.call();


        //es6类的声明
        // class Phone{
        //     constructor(brand, price) {
        //         this.brand = brand;
        //         this.price = price;
        //     }

        //     callaaa() {
        //         console.log(`${this.brand},这个就是es6 call`);
        //     }
        // }

        // let p = new Phone('xiaomi', 1000);
        // console.log(p);
        // p.callaaa();


        //es5的类的声明
        // function Phone(brand, price) {
        //     this.brand = brand;
        //     this.price = price;
        // }

        // Phone.prototype.calloo = function () {
        //     console.log(this.brand, 'es5 可以打电话');
        // }

        // Phone.prototype= {
        //     calloo: function () {
        //         console.log(this.brand, 'es5 可以打电话');
        //     }
        // }
        // var p = new Phone('xiaomi',2000);
        // console.log(p);
        // p.calloo()
    </script>
</body>
</html>